*{
margin: 0;
padding: 0;
}
.ku{
width: 150px;
height: 21px;
cursor: pointer;
border: 2px solid #dd417e;
color:#333;
margin:50px auto;
position:relative;
}
.ku>span{
padding: 0 5px;
display: block;
width: 150px;
height: 21px;
line-height: 22px;
overflow: hidden;
color:#000;
font-size: 14px;
}
.xiala{
width: 440px;
height: 360px;
background: #ffffff;
position: absolute;
top:36px;
left: -2px;
display: none;
border: 2px solid #c9cbce;
z-index: 999;
color:#666;
font-size: 14px;
}
.xiala:before, .xiala:after{
content: '';
display: block;
width: 0;
height: 0;
border-width: 10px;
border-style: solid;
position: absolute;
left: 20px;
z-index: 999999;
}
.xiala:before{
border-color: rgba(181, 70, 70, 0) rgba(16, 15, 15, 0) #fff;
top: -17px;
z-index: 9999999;
}
.xiala:after{
border-color: transparent transparent #c9cbce;
top: -20px;
}
.xiala>h1{
width: 430px;
font-size: 14px;
font-weight: normal;
color:#333;
height: 35px;
border-bottom: 1px solid #ddd;
margin: 0 auto;
}
.xiala>h1>span{
display: block;
float: right;
width: 50px;
height: 20px;
line-height: 20px;
text-align: center;
background: #00a6e2;
margin-right: 10px;
color: #fff;
margin-top: 8px;
}
.xiala>div{
width: 78px;
height: 35px;
text-align: center;
line-height: 35px;
float: left;
margin: 5px;
background: #f5f5f5;
position: relative;
color:#333;
}
.xiala>div>p{
display: none;
width: 370px;
height: 220px;
background: #fff;
position: relative;
padding: 10px 5px;
top:10px;
left: -1px;
z-index: 1;
border: 2px solid #c9cbce;
}
.xiala>div>p:before, .xiala>div>p:after{
content: '';
display: block;
width: 0;
height: 0;
border-width: 10px;
border-style: solid;
position: absolute;
left: 20px;
z-index: 999999;
}
.xiala>div>p:before{
border-color: rgba(181, 70, 70, 0) rgba(16, 15, 15, 0) #fff;
top: -17px;
z-index: 9999999;
}
.xiala>div>p:after{
border-color: transparent transparent #c9cbce;
top: -20px;
}
.xiala>div>p>div{
margin: 5px;
float: left;
position: relative;
padding: 0px 10px;
background: #f5f5f5;
color:#333;
}
.xiala>div>p>div>p{
width: 270px;
min-height: 30px;
padding: 5px;
position: absolute;
top:45px;
left:-105px;
display: none;
z-index: 2;
background: #fff;
border: 2px solid #c9cbce;
}
.xiala>div>p>div>p:before, .xiala>div>p>div>p:after{
content: '';
display: block;
width: 0;
height: 0;
border-width: 10px;
border-style: solid;
position: absolute;
left: 125px;
z-index: 999999;
}
.xiala>div>p>div>p:before{
border-color: rgba(181, 70, 70, 0) rgba(16, 15, 15, 0) #fff;
top: -17px;
z-index: 9999999;
}
.xiala>div>p>div>p:after{
border-color: transparent transparent #c9cbce;
top: -20px;
}
.xiala>div>p>div>p>span{
margin: 4px;
padding: 5px 6px;
float: left;
text-align: left;
height: 25px;
line-height: 25px;
display: block;
background: #f5f5f5;
color:#333;
}
#province,#city,#county{
display: none;
}